<template>
      <el-dialog   :visible.sync="visible" :title="title"  width="650px"  :before-close="handleClose">
          <el-form :model="queryParams" ref="queryForm" :inline="true"  label-width="68px"  >


                <el-form-item label="类型" prop="warntype">
                  <el-select v-model="queryParams.warntype" placeholder="请选择类型" clearable size="small">
                    <el-option
                      v-for="dict in warntypeOptions"
                      :key="dict.dictValue"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                    />
                  </el-select>
                </el-form-item>

                <el-form-item>
                  <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                  <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
                </el-form-item>
              </el-form>



              <el-table v-loading="loading" :data="warnList">
               <el-table-column label="设备" align="center" prop="zyxDevice.devicemodel" />
                <el-table-column label="提醒类型" align="center" prop="warntype" :formatter="warntypeFormat" />
                <el-table-column label="提醒日期" align="center" prop="warndate" width="180">
                  <template slot-scope="scope">
                    <span>{{ parseTime(scope.row.warndate, '{y}-{m}-{d}') }}</span>
                  </template>
                </el-table-column>
                <el-table-column label="是否已读" align="center" prop="isread" :formatter="isreadFormat" />
                <el-table-column
                  label="操作"
                  align="center"
                  width="160"
                  class-name="small-padding fixed-width"
                >
                  <template slot-scope="scope">

                    <el-button
                      v-if="scope.row.isread !== 'Y'"
                      size="mini"
                      type="text"
                      @click="handleRead(scope.row)"

                    >标记为已读</el-button>

                  </template>
                </el-table-column>
              </el-table>

              <pagination
                v-show="total>0"
                :total="total"
                :page.sync="queryParams.pageNum"
                :limit.sync="queryParams.pageSize"
                @pagination="getList"
              />
        <!-- <span slot="footer" class="dialog-footer">
            <el-button @click="visible = false">关 闭</el-button>
          </span> -->
      </el-dialog>
</template>

<script>
  import { listWarn,updMyWarnRead } from "@/api/zyx/warn";

  export default{
    name: 'warnModal',
    components: {},
    data() {
      return {
         visible: false,
         title:'提示',
         // 查询参数
         queryParams: {
           pageNum: 1,
           pageSize: 10,
           departid: null,
           deviceid: null,
           servieid: null,
           warntype: null,
           isread: null,
         },
         // 总条数
         total: 0,
         // 提醒信息表格数据
         warnList: [],
         // 类型字典
         warntypeOptions: [],
         // 是否已读 1已读0未读字典
         isreadOptions: [],
      }},
      created() {
        this.getList();
        this.getDicts("zyx_warntype").then(response => {
          this.warntypeOptions = response.data;
        });
        this.getDicts("sys_yes_no").then(response => {
          this.isreadOptions = response.data;
        });
      },
      methods:{
        /** 重置按钮操作 */
        resetQuery() {
          this.resetForm("queryForm");
          this.handleQuery();
        },
        /** 搜索按钮操作 */
        handleQuery() {
          this.queryParams.pageNum = 1;
          this.getList();
        },
     /** 查询提醒信息列表 */
        getList() {
          this.loading = true;
          listWarn(this.queryParams).then(response => {
            this.warnList = response.rows;
            this.total = response.total;
            this.loading = false;
          });
        },
        // 类型字典翻译
        warntypeFormat(row, column) {
          return this.selectDictLabel(this.warntypeOptions, row.warntype);
        },
        // 是否已读 1已读0未读字典翻译
        isreadFormat(row, column) {
          return this.selectDictLabel(this.isreadOptions, row.isread);
        },
        handleRead(row){
          updMyWarnRead(row.id).then(response => {
            this.getList();
          });
        },
        handleClose(done) {
          console.log('donw')
          this.$parent.getnum();
          done();
          }
      }
  }
</script>

<style>
</style>
